/* stylelint-disable */
@import "./variables.less";
@import "./font-family.less";

// layout rewrite
.t-layout__sider {
  width: fit-content;
  background: linear-gradient(180deg, rgba(0,79,136,0.56) 0%, rgba(0,61,105,0.57) 22%, rgba(1,42,71,0.47) 61%, rgba(0,72,122,0.33) 100%) linear-gradient(270deg, #51BEFF 0%, rgba(0,159,255,0.45) 1%, rgba(0,132,211,0.41) 4%, rgba(0,0,0,0) 100%) !important;
  -webkit-transition: all 0s;
   transition: all 0s;
}

.t-layout__header {
    height: auto;
    background: linear-gradient(360deg, #51BEFF 0%, rgba(0,159,255,0.45) 1%, rgba(0,132,211,0.41) 4%, rgba(0,126,201,0.4) 9%, rgba(0,0,0,0) 100%);
  }
  
.t-layout.t-layout--with-sider {
  > .t-layout {
    flex: 1;
    min-width: 760px;
  }
}
.t-layout.t-layout--with-sider {
  > .t-layout__content {
    flex: 1;
    min-width: 760px;
  }
}
.t-menu--dark .t-menu__operations .t-icon {
  color: rgba(255, 255, 255, 0.55);

  &:hover {
    cursor: pointer;
  }
}

.t-default-menu.t-menu--dark {
  background: var(--right-light);
}
// 左侧菜单栏样式
.t-default-menu .t-menu__item {
  padding: 0 10px 0 14px;
  height: 39px;
  line-height: 39px;
  transition: background-color 0s cubic-bezier(0.38, 0, 0.24, 1), padding 0s cubic-bezier(0.38, 0, 0.24, 1);
}

.t-default-menu:not(.t-menu--dark) .t-menu__item.t-is-active:not(.t-is-opened) {
  background-color: var(--td-brand-color-1);
  color: var(--td-brand-color);

  .t-icon {
    color: var(--td-brand-color);
  }
}

.t-alert--info {
  background-color: var(--td-brand-color-1);
}

.@{starter-prefix} {
  // 布局元素调整
  &-wrapper {
    height: 100vh;
    display: flex;
    flex-direction: column;
  }

  &-main-wrapper {
    height: 500px;
    overflow: scroll;
  }

  &-side-nav-layout {
    &-relative {
      height: 100%;
    }
  }

  &-content-layout {
    padding: @spacer-3;
  }

  &-layout {
    height: calc(100vh - 60px);
    overflow-y: scroll;

    &-tabs-nav {
      max-width: 100%;
      position: fixed;
      overflow: visible;
      z-index: 100;
    }
    &-tabs-nav + .@{starter-prefix}-content-layout {
      padding-top: @spacer-3;
    }

    &::-webkit-scrollbar {
      width: 8px;
      background: transparent;
    }

    &::-webkit-scrollbar-thumb {
      border-radius: 6px;
      border: 2px solid transparent;
      background-clip: content-box;
      background-color: var(--td-scrollbar-color);
    }
  }

  &-footer-layout {
    padding: 0;
    margin-bottom: @spacer-2;
  }

  // slideBar
  &-sidebar-layout {
    height: 100%;
  }

  &-sidebar-compact {
    width: 64px;
  }

  &-sidebar-layout-side {
    z-index: 100;
  }

  &-side-nav {
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 200;
    transition: all 0.3s;
    min-height: 100%;

    &-mix {
      top: 60px;

      &-fixed {
        top: 60px;
        z-index: 0;
      }
    }

    &-no-fixed {
      position: relative;
      z-index: 1;
    }

    &-no-logo {
      z-index: 1;
    }

    &-logo-wrapper {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;

      &:hover {
        cursor: pointer;
      }
    }

    &-logo-t-logo {
      height: 32px;
      width: 100%;
    }

    &-logo-tdesign-logo {
      padding: 0 24px;
      height: 32px;
      width: 100%;
      color: var(--td-text-color-primary);
    }

    &-logo-normal {
      color: var(--td-brand-color);
      font-size: @font-size-l;
      transition: all 0.3s;
    }
  }

  &-side-nav-placeholder {
    flex: 1 1 232px;
    min-width: 232px;
    transition: all 0.3s;

    &-hidden {
      flex: 1 1 72px;
      min-width: 72px;
      transition: all 0.3s;
    }
  }
}

.route-tabs-dropdown {
  .t-icon {
    margin-right: 8px;
  }
}

.logo-container {
  cursor: pointer;
  display: inline-flex;
  height: 64px;
  margin-left: 24px;
}

.version-container {
  color: var(--td-text-color-primary);
  opacity: 0.4;
}

.t-layout__content{
  height: calc(100% - 142px);
  //   background: url(@/assets/bodybg.png) repeat left top !important;
}

.tdesign-starter-content-layout {
  padding: var(--padding-num);
}

.searchHeader .buttonArea{
  margin-left: 20px;
}
.page-panel-height{
  height: calc(100% - 139px)!important;
}
/* stylelint-enable */
